﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<IBupro.Models.StudentProjectModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	<%:Html.Translate("studentProject") %>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2></h2>

    <script language="javascript" type="text/javascript">
        $(function () {
            $("#tabs-tags").tabs();
            $(".autocomplete").val("");
        });
        var allVals = [];

        function settag(sender) {

            if ($(sender).attr("checked", false)) {
                if (!($.inArray($(sender).attr("value"), allVals) === -1)) {

                    allVals[jQuery.inArray($(sender).attr("value"), allVals)] = null;
                    for (var key in allVals) {
                        if (allVals[key] != null) {
                            txt += allVals[key] + ",";
                        }

                    }
                    //$("#texas").text(txt);
                    return;
                }

            }

            if ($(sender).attr("checked", true)) {

                if (($.inArray($(sender).attr("value"), allVals) === -1)) {
                    allVals.push($(sender).attr("value"));
                    var txt = "";
                    for (var key in allVals) {
                        if (allVals[key] != null) {
                            txt += allVals[key] + ",";
                        }

                    }
                    //$("#texas").text(txt);
                    return;
                }


            }
        }

        function formSubmit(sender) {
            var txt = "";
            for (i = 0; i < allVals.length; i++) {
                if (allVals[i] != null) {
                    txt += allVals[i] + ",";
                }
            }
            $(".autocomplete").val(txt + $(".autocomplete").val());
            return true;
        }
	
	</script>

    <% using (Html.BeginForm()) {%>
        <%: Html.ValidationSummary(true) %>

        <div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
	        <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
		        <li class="ui-state-default ui-corner-top ui-tabs-selected"><%:Html.ActionLink(Html.Translate("diplomProject"),"Create","DiplomProject") %></li>
		        <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><%:Html.ActionLink(Html.Translate("studentProjects"), "Create", "StudentProject")%></li>
	        </ul>
        </div>

        <fieldset>         
            <div class="editor-label">
                <%: Html.Translate("name") %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.Name) %>
                <%: Html.ValidationMessageFor(model => model.Name) %>
            </div>

            <div class="editor-label">
                <%: Html.Translate("locked") %>
            </div>
            <div class="editor-field">
                <%: Html.CheckBoxFor(model => model.Locked) %>
                <%: Html.ValidationMessageFor(model => model.Locked) %>
            </div>

            <div class="editor-label">
                <%: Html.Translate("shortcut") %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.ShortCut) %>
                <%: Html.ValidationMessageFor(model => model.ShortCut) %>
            </div>

            <div class="editor-label">
				<label for="Tags"><%: Html.Translate("tags") %></label>
				<div id="tabs-tags">
				<ul>
					<li><a href="#tabs-1"><%:Html.Translate("languages") %></a></li>
					<li><a href="#tabs-2"><%:Html.Translate("technologies")%></a></li>
					<li><a href="#tabs-3"><%:Html.Translate("os")%></a></li>
				</ul>
				<div id="tabs-1">
				   <input type="checkbox" value="C#" onchange="settag(this)"/> C#
				   <input type="checkbox" value="PHP" onchange="settag(this)"/> PHP
				   <input type="checkbox" value="C++" onchange="settag(this)"/> C++
				   <input type="checkbox" value="Java" onchange="settag(this)"/> Java
				   <input type="checkbox" value="Python" onchange="settag(this)"/> Python
				   <input type="checkbox" value="SQL" onchange="settag(this)"/> SQL
				   <input type="checkbox" value="C" onchange="settag(this)"/> C
				   <input type="checkbox" value="Ruby" onchange="settag(this)"/> Ruby
				   <input type="checkbox" value="Pascal" onchange="settag(this)"/> Pascal

				</div>
				<div id="tabs-2">
				   <input type="checkbox" value="ASP.NET" onchange="settag(this)"/> ASP.NET
				   <input type="checkbox" value="Ruby Rails" onchange="settag(this)"/> Ruby Rails
				   <input type="checkbox" value="JSF" onchange="settag(this)"/> JSF
				   <input type="checkbox" value="Django" onchange="settag(this)"/> Django
				   <input type="checkbox" value="IIS" onchange="settag(this)"/> IIS
				   <input type="checkbox" value="Apache" onchange="settag(this)"/> Apache
				   <input type="checkbox" value="JBoss" onchange="settag(this)"/> JBoss
				   <input type="checkbox" value="EJB" onchange="settag(this)"/> EJB
				</div>
				<div id="tabs-3">
					<input type="checkbox" value="Linux" onchange="settag(this)"/> Linux
					<input type="checkbox" value="Windows" onchange="settag(this)"/> Windows
					<input type="checkbox" value="Unix" onchange="settag(this)"/> Unix
					<input type="checkbox" value="Mac OS" onchange="settag(this)"/> Mac OS
					<input type="checkbox" value="Android" onchange="settag(this)"/> Android
					<input type="checkbox" value="iOS" onchange="settag(this)"/> iOS
				</div>
			</div>
			</div>
			<div class="editor-field">
				<%: Html.TextBoxFor(model => model.Tags, new {@class = "autocomplete" })%>
			</div>
            
            <div class="editor-label">
                <%: Html.Translate("details") %>
            </div>
            <div class="editor-field">
                <%: Html.TextAreaFor(model => model.Detail,10,50,null) %>
                <%: Html.ValidationMessageFor(model => model.Detail) %>
            </div>
            
            <div class="editor-label">
                <%: Html.Translate("subject") %>
            </div>
            <div class="editor-field">
                <%: Html.DropDownList("SubjectId",Model.GetSubjectList()) %>
                <%: Html.ValidationMessageFor(model => model.SubjectId) %>
            </div>
            
            <div class="editor-label">
                <%: Html.Translate("memberCount") %>
            </div>
            <div class="editor-field">
                <%: Html.TextBoxFor(model => model.MemberCount) %>
                <%: Html.ValidationMessageFor(model => model.MemberCount) %>
            </div>
            
            <p>
                <input type="submit" value="<%:Html.Translate("create") %>" onclick="formSubmit(this)"/>
            </p>
        </fieldset>

    <% } %>
    <script type="text/javascript">

        $(function () {
            $(".autocomplete").autocomplete({
                source: function (request, response) {
                    $.getJSON("/Tag/List", {
                        term: extractLast(request.term)
                    }, response);
                },
                search: function () {
                    // custom minLength
                    var term = extractLast(this.value);
                    if (term.length < 1) {
                        return false;
                    }
                },
                focus: function () {
                    // prevent value inserted on focus
                    return false;
                },
                select: function (event, ui) {
                    var terms = split(this.value);
                    // remove the current input
                    terms.pop();
                    // add the selected item
                    terms.push(ui.item.value);
                    // add placeholder to get the comma-and-space at the end
                    terms.push("");
                    this.value = terms.join(", ");
                    return false;
                },
                selectFirst: function () {
                    // prevent value inserted on focus
                    return true;
                },
                change: function (event, ui) {
                    //if the value of the textbox does not match a suggestion, clear its value
                    if ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0) {
                        $(this).val('');
                    }
                }
            }).live('keydown', function (e) {
                var keyCode = e.keyCode || e.which;
                //if TAB or RETURN is pressed and the text in the textbox does not match a suggestion, set the value of the textbox to the text of the first suggestion
                if ((keyCode == 9 || keyCode == 13) && ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0)) {
                    $(this).val($(".ui-autocomplete li:visible:first").text());
                }


            });
            function split(val) {
                return val.split(/,\s*/);
            }
            function extractLast(term) {
                return split(term).pop();
            }
        });
	</script>
    <div>
        <%: Html.ActionLink(Html.Translate("backToList"), "Index") %>
    </div>

</asp:Content>

